<template>
  <div style="width: 200px; height: 200px; background-color: cyan; margin: 20px;">
son3--{{ money }}
<button @click="updataMoney($parent)">点击父亲减30son3加30</button>
<div style="width: 200px; height: 100px; background-color: gold;">
  {{car}}
<button @click="handle">点击换成自行车</button>
</div>
  </div>
</template>

<script setup lang="ts">
import {ref, inject} from 'vue'

const money = ref(10000)
const change = () => {
  money.value -= 10
}

const updataMoney = ($parent: any) => {
  money.value += 30
  $parent.money -=30
  console.log($parent);
}

const car = inject('car')

const handle = () => {
  car.value = '自行车'
}

defineExpose({money, change})
</script>

<style scoped>

</style>